<template>
    <div class="selectRadio">
        <el-select v-model="value" filterable
            placeholder="请选择" clearable
            @change='handleChange'
            ref='selectRadio'>
            <el-option
                v-for="item in list" :key="item.value" :label="item.label"
                :value="item.value"
                class="optionList"    
            >
            </el-option>
        </el-select>
    </div>
</template>

<script>
export default {
    props: {
        iptAttritube: {
            type: Object,
            default: () => {}
        }
    },
    data() {
        return {
            value: '',
            list: []
        }
    },
    mounted() {
        let data = [...new Set(this.iptAttritube.list)]
        this.list = data.map((item, i) => {
            return {
                label: item,
                value: item
            }
        })
    },
    methods: {
        handleChange() {
            let value = {
                value: this.value,
            }
            this.$emit('handleChange', value, '0')
            this.$nextTick(() => {
                this.$refs.selectRadio.blur()
            })
        },
        defaultData(d) {
            this.value = ''
            d.map(item => {
                if(item.customFieldId == this.iptAttritube.cusField) {
                    if(item.customFieldId == 'pricing') {
                        this.value = item.value == 0 ? '计件' : '计时'
                    } else {
                        this.value = item.value
                    }
                }
            })
        }
    },
    watch: {
        iptAttritube: {
            handler(val) {
                this.list = val.list.map((item, i) => {
                    return {
                        label: item,
                        value: item
                    }
                })
            },
            deep: true
        }
    }
}
</script>